<!DOCTYPE html>
<html>
<head lang="en">
	<meta charset="UTF-8">
<title>图片轮换</title>
	<link rel="stylesheet" href="../css/scroll.css">

</head>

<body>
<div class="scroll">
	<div id="num">
		<a href="#" onclick="change(1)">1</a>
		<a href="#" onclick="change(2)">2</a>
		<a href="#" onclick="change(3)">3</a>
		<a href="#" onclick="change(4)">4</a>
		<a href="#" onclick="change(5)">5</a>
	</div>
	<img src="../images/1.gif" alt="图片1" id="photo"/>
</div>
</body>
<script>
	function change(num){
		var obj=document.getElementById("photo");
		switch(num){
			case 1:
			obj.setAttribute("src","../images/1.gif");
			obj.setAttribute("alt","图片1");
			break;
			case 2:
			obj.setAttribute("src","../images/2.gif");
			obj.setAttribute("alt","图片2");
			break;
			case 3:
			obj.setAttribute("src","../images/3.jpg");
			obj.setAttribute("alt","图片3");
			break;
			case 4:
			obj.setAttribute("src","../images/4.jpg");
			obj.setAttribute("alt","图片4");
			break;
			case 5:
			obj.setAttribute("src","../images/5.gif");
			obj.setAttribute("alt","图片2");
			break;
		}
	}
</script>
</html>
